﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Untitled Page</title>
    <script type="text/javascript" src="http://www.google.com/jsapi"></script> 
    <script src="ajax.js" type="text/javascript"></script>
    
    <script type="text/javascript">
        // Load the Visualization API and the piechart package.
        google.load('visualization', '1', { packages: ['imagebarchart'] });
        // Set a callback to run when the API is loaded.
        google.setOnLoadCallback(drawChart);
        // Callback that creates and populates a data table, 
        // instantiates the pie chart, passes in the data and 
        // draws it. 
//        sendGetRequest("http://localhost/MyWebServices/MoodleService.asmx/GetActivityCountByCourse?courseid=2");
        //sendGetRequest("http: //localhost/MyServices/MoodleService.svc/ajaxEndPoint/GetActivityCountByCourse?courseid=0");
        //sendGetRequest("http://localhost/testsite/default.aspx");
        //alert("XX");
        function drawChart() {
//            var data = new google.visualization.DataTable();
//            data.addColumn('string', 'Task');
//            data.addColumn('number', 'Hours per Day');
//            data.addRows(5);
//            data.setValue(0, 0, 'Work');
//            data.setValue(0, 1, 11);
//            data.setValue(1, 0, 'Eat');
//            data.setValue(1, 1, 2);
//            data.setValue(2, 0, 'Commute');
//            data.setValue(2, 1, 2);
//            data.setValue(3, 0, 'Watch TV');
//            data.setValue(3, 1, 2);
//            data.setValue(4, 0, 'Sleep');
//            data.setValue(4, 1, 7);

//            var chart = new google.visualization.PieChart(document.getElementById('chart_div'));
//            chart.draw(data, { width: 400, height: 240, is3D: true, title: 'My Daily Activities' });
            sendGetRequest("http://localhost/MyWebServices/MoodleService.asmx/GetCourseActivity?categoryid=7");
        }
        
        function stateChanged() {
            if (XMLHTTP.readyState == 4 && XMLHTTP.status == 200) {
                var xml = new ActiveXObject("Microsoft.XMLDOM");
                xml.loadXML(XMLHTTP.responseText);
                //alert(xml.documentElement.xml);
                var Elements = xml.getElementsByTagName("ActivityName");
                var ElementsValue = xml.getElementsByTagName("ActivityCount");
                //alert(Elements.length);
                var data = new google.visualization.DataTable();
                data.addColumn('string', 'Name');
                data.addColumn('number', 'Count');
                data.addRows(Elements.length);
                for (n = 0; n < data.getNumberOfRows(); n++) {
                    data.setCell(n, 0, Elements[n].text);
                    data.setCell(n, 1, parseInt(ElementsValue[n].text));
                }
                //alert(data);
                var chart = new google.visualization.ImageBarChart(document.getElementById('chart_div'));
                chart.draw(data, { width: 800, height: 240, is3D: true, title: 'Course Activities' });
            }
        }
    </script>
</head>
<body>
<div id="chart_div"></div>
</body>
</html>
